import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router';
import Home from '../views/Home.vue';

// 公用模块
// const constantFiles = require.context('./constantModules', true, /\.ts$/);
// let constantModules: Array<RouteRecordRaw> = [];
// constantFiles.keys().forEach((key) => {
//     if (key === './index.ts') return;
//     constantModules = constantModules.concat(constantFiles(key).default);
// });

// 权限模块
// const asyncFiles = require.context('./permissionModules', true, /\.ts$/);
// let permissionModules: Array<RouteRecordRaw> = [];
// asyncFiles.keys().forEach((key) => {
//     if (key === './index.ts') return;
//     permissionModules = permissionModules.concat(asyncFiles(key).default);
// });

// export const constantRoutes: Array<RouteRecordRaw> = [...constantModules];

// export const asyncRoutes: Array<RouteRecordRaw> = [...permissionModules];

// routes的约束类型是 RouteRecordRaw

// 联合类型 扩展路由类型
type RouteConfig = RouteRecordRaw & { hidden?: boolean }; // hidden 是可选属性

const routes: Array<RouteConfig> = [
	{
		path: '/',
		name: 'Home',
		hidden: true,
		component: Home,
	},
	{
		path: '/setup',
		name: 'setup',
		component: () => import(/* webpackChunkName: "setup" */ '../views/setup/index.vue'),
	},
	{
		path: '/model',
		name: 'model',
		component: () => import(/* webpackChunkName: "model" */ '../views/v-model/index.vue'),
	},
	{
		path: '/emit',
		name: 'emit',
		component: () => import(/* webpackChunkName: "emit" */ '../views/emit/index.vue'),
	},
	{
		path: '/ref',
		name: 'ref',
		component: () => import(/* webpackChunkName: "ref" */ '../views/refs/index.vue'),
	},
	{
		path: '/bind',
		name: 'bind',
		component: () => import(/* webpackChunkName: "bind" */ '../views/bind/index.vue'),
	},
	{
		path: '/props',
		name: 'props',
		component: () => import(/* webpackChunkName: "props" */ '../views/props/index.vue'),
	},
	{
		path: '/attrs',
		name: 'attrs',
		component: () => import(/* webpackChunkName: "attrs" */ '../views/attrs/index.vue'),
	},
	{
		path: '/mixins',
		name: 'mixins',
		component: () => import(/* webpackChunkName: "mixins" */ '../views/mixins/index.vue'),
	},
	{
		path: '/vuex',
		name: 'vuex',
		component: () => import(/* webpackChunkName: "vuex" */ '../views/vuex/index.vue'),
	},
	{
		path: '/pinia',
		name: 'pinia',
		component: () => import(/* webpackChunkName: "pinia" */ '../views/pinia/index.vue'),
	},
	{
		path: '/provide-inject',
		name: 'provide-inject',
		component: () => import(/* webpackChunkName: "provide-inject" */ '../views/provide-inject/index.vue'),
	},
	{
		path: '/SFC',
		name: 'SFC',
		component: () => import(/* webpackChunkName: "SFC" */ '../views/SFC/index.vue'),
	},
	{
		path: '/hook',
		name: 'hook',
		component: () => import(/* webpackChunkName: "hook" */ '../views/hook/index.vue'),
	},
	{
		path: '/Suspense',
		name: 'Suspense',
		component: () => import(/* webpackChunkName: "Suspense" */ '../views/Suspense/index.vue'),
	},
	{
		path: '/teleport',
		name: 'teleport',
		component: () => import(/* webpackChunkName: "teleport" */ '../views/teleport/index.vue'),
	},
	{
		path: '/TS',
		name: 'TS',
		component: () => import(/* webpackChunkName: "TS" */ '../views/TS/index.vue'),
	},
	{
		path: '/ref-toRef',
		name: 'ref-toRef',
		component: () => import(/* webpackChunkName: "ref-toRef" */ '../views/ref-toRef/index.vue'),
	},
	{
		path: '/script-setup',
		name: 'script-setup',
		component: () => import(/* webpackChunkName: "script-setup" */ '../views/script-setup/index.vue'),
	},
	{
		path: '/mitt',
		name: 'mitt',
		component: () => import(/* webpackChunkName: "mitt" */ '../views/plugins/mitt/index.vue'),
	},
	{
		path: '/directive',
		name: 'directive',
		component: () => import(/* webpackChunkName: "directive" */ '../views/directive/index.vue'),
	},
	{
		path: '/prop-attr',
		name: 'prop-attr',
		component: () => import(/* webpackChunkName: "prop-attr" */ '../views/prop-attr/index.vue'),
	},
	{
		path: '/watch',
		name: 'watch',
		component: () => import(/* webpackChunkName: "watch" */ '../views/watch/index.vue'),
	},
	{
		path: '/transition',
		name: 'transition',
		component: () => import(/* webpackChunkName: "transition" */ '../views/transition/index.vue'),
	},
	{
		path: '/component',
		name: 'component',
		component: () => import(/* webpackChunkName: "component" */ '../views/component/index.vue'),
	},
	{
		path: '/custom-plugins',
		name: 'custom-plugins',
		component: () => import(/* webpackChunkName: "custom-plugins" */ '../views/custom-plugins/index.vue'),
	},
];

const router = createRouter({
	history: createWebHistory(process.env.BASE_URL), // 设置baseUrl 。 不传 或 process.env.BASE_URL默认都是'/'
	routes,
	// routes: routes.concat(constantRoutes),
});

export function resetRouter() {
	const newRouter = router;
	(router as any).matcher = (newRouter as any).matcher; // reset router
}

export default router;
